import { Component, OnInit } from '@angular/core';
import { NzMessageService, UploadFile } from 'ng-zorro-antd';
import { MerchantService } from '../../service/merchant.service';
import { MerchantdisheService } from '../../service/merchantdishe.service';
import { CommonService } from '../../service/common.service';
import { config } from '../../../config';
import { RoleRight } from '../../../kalend';
@Component({
  selector: 'app-merchantdishe',
  templateUrl: './merchantdishe.component.html',
  styleUrls: ['./merchantdishe.component.scss'],
  providers: [MerchantService, MerchantdisheService]
})
export class MerchantdisheComponent implements OnInit {
  user: any = RoleRight.getStorage();
  name: any;
  pageIndex = 1;
  pageSize = 15;
  total = 1;
  dataSet = [];
  loading = true;
  isOkLoading = false;
  isVisible = false;
  doc: any = {};
  status: any;
  statuslist = [{ key: null, value: '全部' }, { key: 1, value: '有效' }, { key: 0, value: '禁用' }];
  merchantlist = [];
  mid = RoleRight.getStorage().merchantid;
  typeItems = [{ key: '热销', value: '热销' }, { key: '推荐', value: '推荐' }, { key: '其它', value: '其它' }];
  action = config.imageuploadurl;

  private getBase64(img: File, callback: (img: string) => void): void {
    const reader = new FileReader();
    reader.addEventListener('load', () => callback(reader.result.toString()));
    reader.readAsDataURL(img);
  }

  // tslint:disable-next-line:max-line-length
  constructor(private service: MerchantdisheService, private merchservice: MerchantService, private msg: NzMessageService, private commonservice: CommonService) {

  }
  beforeUpload = (file: File) => {
    const isJPG = file.type === 'image/jpeg' || 'image/png';
    if (!isJPG) {
      this.msg.error('您只能上传图片文件!');
    }
    const isLt2M = file.size / 1024 / 1024 < 2;
    if (!isLt2M) {
      this.msg.error('图片大小不能超过 2MB!');
    }
    return isJPG && isLt2M;
  }
  handleChange(info: { file: UploadFile }, url: string): void {
    if (info.file.status === 'uploading') {
      this.loading = true;
      return;
    }
    if (info.file.status === 'done') {
      // Get this url from response in real world.
      this.getBase64(info.file.originFileObj, (img: string) => {
        this.loading = false;
        if (info.file && info.file.response && info.file.response.data) {
          this.doc.img = info.file.response.data;
        }
      });
    }
  }

  ngOnInit() {
    // this.merchservice.querybyuserid({userid:this.user._id, offset:1,
    // limit:10}).then((res) => {
    //   this.merchantlist = res.rows.map((item) => {
    //     this.mid=item._id;
    //     return {
    //       key: item._id,
    //       value: item.name
    //     };
    //   });

      this.searchData();
    // })
  }

  searchData(reset: boolean = false): void {
    this.loading = true;
    this.service.query({
      offset: this.pageIndex,
      limit: this.pageSize,
      mid: this.mid,
      status: this.status,
      name: this.name
    }).then((res) => {
      this.loading = false;
      this.total = res.total;
      this.dataSet = res.rows;
    });
  }

  /**新增 */
  add() {
    if (!this.mid) {
      this.msg.warning('请选择商户！');
      return;
    } else {
      this.doc.merchantid = this.mid;
      this.doc.creater = this.user._id;
      this.isVisible = true;
    }
  }

  /**修改 */
  edit(id: any) {
    this.isVisible = true;
    this.service.queryById(id).then((res) => {
      this.doc = res;
    });
  }

  /**禁用 */
  lock(id: any) {
    this.commonservice.confirm('确认下架吗？', () => {
      this.service.lock(id).then((res) => {
        this.searchData();
      });
    });
  }
  /**启用 */
  open(id: any) {
    this.commonservice.confirm('确认上架吗？', () => {
      this.service.open(id).then((res) => {
        this.searchData();
      });
    });
  }

  handleOk(): void {
    this.isOkLoading = true;
    if (!this.doc.name || this.doc.name == '') {
      this.msg.warning('请填写菜品名！');
    } else if (!this.doc.type) {
      this.msg.warning('请选择菜品类型！');
    } else {
      this.service.save(this.doc).then((res) => {
        this.searchData();
        if (this.doc._id) {
          this.msg.success('修改成功！');
        } else {
          this.msg.success('添加成功！');
        }
        this.isVisible = false;
        this.doc = {};
      });
    }
  }
  handleCancel(): void {
    this.isVisible = false;
    this.doc = {};
  }

}
